<template>
  <div>
<!--    <Search :search='search' :reset='reset'>-->
<!--      <template v-slot:body>-->
<!--        <el-form-item label='标题' prop='jump_title'>-->
<!--          <el-input v-model='query.jump_title' name='jump_title' clearable />-->
<!--        </el-form-item>-->
<!--      </template>-->
<!--    </Search>-->
    <div class='table-default'>
      <el-table :data='tableData' class='mt-3' v-loading='loading'>
        <el-table-column prop='jump_title' label='标题' />
        <el-table-column prop='created_at' label='时间' />
        <el-table-column prop='jump_ip' label='IP' />
        <el-table-column prop='jump_ip_country' label='国家' />
        <el-table-column prop='jump_device' label='设备' />
        <el-table-column prop='request_url' label='请求/来源网址' />
        <el-table-column prop='jump_error' label='放行'>
          <template #default="scope">
            <div v-if='scope.row.jump_error '>
              否
            </div>
            <div style="color: #ff0000" v-else>
              是
            </div>
          </template>
        </el-table-column>
        <el-table-column prop='jump_error' label='屏蔽原因' />
      </el-table>
      <Paginate />
    </div>
  </div>
</template>

<script lang='ts' setup>
import { computed, onMounted, ref, unref } from 'vue'
import { useGetList } from '@/composables/curd/useGetList'
import { useDestroy } from '@/composables/curd/useDestroy'
import { useOpen } from '@/composables/curd/useOpen'
import { useUserStore } from '@/stores/modules/user'
import { getBaseUrl, queryParams } from '@/support/helper'

const api = '/jump/log'
const { toClipboard } = useClipboard()
const {
  data,
  query,
  search,
  reset,
  loading
} = useGetList(api)
const {
  destroy,
  deleted
} = useDestroy()
const {
  open,
  close,
  title,
  visible,
  id
} = useOpen()
const userStore = useUserStore()
const tableData = computed(() => data.value?.data)
const shortcuts = [
  {
    text: '昨天',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 )
      return [start, end]
    },
  },
  {
    text: '上周',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
      return [start, end]
    },
  },
  {
    text: '一个月前',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
      return [start, end]
    },
  },
  {
    text: '三个月前',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
      return [start, end]
    },
  },
]
onMounted(() => {
  search()
})
</script>
